<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .box {
            width: 500px;
            height: 500px;
            background-color: #ccc;
            color: #fff;
            text-align: center;
            font-size: 100px;
        }
    </style>
</head>

<body>
    <div class="box"></div>

    <script src="./lodash.min.js"></script>
    <script>
        const box = document.querySelector('.box')

        let i = 1
        function mouseMove() {
            i++
            box.innerHTML = i
        }

        //防抖函数
        // function debounce(fn, t) {
        //     let timeId
        //     return function () {

        //         if (timeId) {
        //             clearTimeout(timeId)
        //         }
        //         timeId = setTimeout(function () {
        //             fn()
        //         }, t)
        //     }
        // }

        box.addEventListener('mousemove', _.debounce(mouseMove, 500))






    </script>

</body>

</html>